<template>
    <div class="courses-nav">
        <el-menu :default-active="activeIndex" class="el-menu-demo"  mode="horizontal" :router="true"  v-if="roleId == 'TEACHER' || roleId == 'UNIVERSITY_TEACHER' || roleId == 'MARKET_TEACHER' ">
            <el-menu-item index="/Teaching/MyCourses/Interflow/Answer/AnswerList">问题列表</el-menu-item>
            <el-menu-item index="/Teaching/MyCourses/Interflow/MyQuestion/QuestionList">我的问题</el-menu-item>
            <el-menu-item index="/Teaching/MyCourses/Interflow/MyAnswer/MyAnswerList">我的回答</el-menu-item>
            <el-menu-item index="/Teaching/MyCourses/Interflow/ForbiddenMange/Forbiddenlist">禁言管理</el-menu-item>
            <el-menu-item index="/Teaching/MyCourses/Interflow/CommunicatiSwitch">是否开启交流</el-menu-item>
        </el-menu>
         <el-menu :default-active="activeIndex" class="el-menu-demo"  mode="horizontal" :router="true" v-if="roleId == 'STUDENT'">
            <el-menu-item index="/Teaching/MyCourses/Swap/Answer/SAnswerList" :disabled="limts" >问题列表</el-menu-item>
            <el-menu-item index="/Teaching/MyCourses/Swap/SMyAnswer/SMyAnswer" :disabled="limts">我的回答</el-menu-item>
            <el-menu-item index="/Teaching/MyCourses/Swap/SMyQuestion/SMyQuestion" :disabled="limts">我的问题</el-menu-item>
        </el-menu>
    </div>
</template>

<script>
    export default {
        props: ['websockMsg'],
        data () {
            return {
                activeIndex: '',
                roleId:'',
                //消息通知判断显隐
                limts: false,
            }
        },
        created () {
            let self = this
            //self.handelStudentWs()
            self.roleId=this.$store.state.user.roles[0]

            // self.InitWebSocket()
            self.fetchDate()
            // 判断导航是否显示
            self.AnswerNav()
            //  this.limts = this.$localstorage.getLocalStorage('limts')
        },
        destroyed: function() {
            //页面销毁时关闭长连接
            // this.over()
        },
        methods: {
            AnswerNav() {
                let self = this
                let courseId = this.$localstorage.getLocalStorage('setCourseId')
                self.$http.get('/tes/problemCommunication/getProblemSwitch/'+courseId).then(reponse => {
                    let res = reponse.data
                    if(res.code == '200'){
                        if(!res.data.pcSwitch){
                            self.limts = true
                        }else{
                            self.limts = false
                        }
                    }else{
                        self.$message.error(res.message)
                    }
                }).catch(err => {
                    console.log(err)
                })
            },
            //通知webSocket
            InitWebSocket() {
                let self = this;
                let hostname = window.location.host;
                const wsuri = "ws://" + hostname + "/tes/ws/global";
                self.websock = new WebSocket(wsuri);
                self.websock.onopen = self.websocketonopen;
                self.websock.onmessage = self.websocketonmessage;
                self.over = () => {
                    self.websock.close();
                };
            },
              websocketonopen(){
                console.log('open sucess')
            },
             websocketonmessage(e) {
                //数据接收
                let self = this
                const redata = JSON.parse(e.data)
                if (redata.type == 20) {
                    //开启问题交流
                    self.limts = true
                } else if (redata.type == 21) {
                    //关闭问题交流
                    self.limts = false
                }
            },
            fetchDate() {
                let self = this
                let cur_path = self.$route.meta.navActive
                self.activeIndex = cur_path
            }
        },
        watch: {
            "$route": "fetchDate",
            'websockMsg': {
                handler: function(newval , oldval) {
                    let self = this
                    if (newval.type == 20) {
                        //开启问题交流
                        self.limts = true
                        self.$localstorage.putLocalStorage('limts', true) //设置值
                    } else if (newval.type == 21) {
                        //关闭问题交流
                        self.limts = false
                        self.$localstorage.putLocalStorage('limts', false) //设置值
                    }
                },
            },
            deep: true
		}
    }
</script>
<style scoped  lang="scss">
    .el-menu-demo{
        .el-menu-item{
            &:hover{
                    color:#1277eb
            }
        }
    }

</style>
